window.onload = function () {
  var window_width, window_height,
    field_width, field_height,
    rate_w, rate_h,
    field, text, cat, cat_shadow, speeder, speeder_shadow, buliding_1, building_2;

  window_width = document.body.clientWidth;
  window_height = document.body.clientHeight;

  field = document.getElementById('field');
  field_width = field.offsetWidth;
  field_height = field.offsetHeight;

  rate_w = field_width / window_width;
  rate_h = field_height / window_height;

  var imgArray = {
    bg: {
      left: -780,
      top: -200,
      scale: 0.06,
      isFont: false
    },
    text: {
      left: -500,
      top: -120,
      scale: 0.03,
      isFont: true
    },
    cat: {
      left: -200,
      top: -100,
      scale: 0.02,
      isFont: true
    },
    cat_shadow: {
      left: -189,
      top: 100,
      scale: 0.02,
      isFont: true
    },
    speeder: {
      left: -70,
      top: -40,
      scale: 0.01,
      isFont: true
    },
    speeder_shadow: {
      left: -70,
      top: 75,
      scale: 0.01,
      isFont: true
    },
    building_1: {
      left: 20,
      top: -111,
      scale: 0.03,
      isFont: false
    },
    building_2: {
      left: 300,
      top: -60,
      scale: 0.05,
      isFont: false
    },
  };

  (function () {
    for (i in imgArray) {
      var theImg = document.getElementsByClassName("img_" + i)[0];
      //
      var offset_w = field_width / 2 * imgArray[i].scale;
      var offset_h = field_height / 2 * imgArray[i].scale;
      if (imgArray[i].isFont == true) {
        theImg.style.left = field_width / 2 + offset_w + imgArray[i].left + "px";
        theImg.style.top = field_height / 2 + offset_h + imgArray[i].top + "px";
      } else {
        theImg.style.left = field_width / 2 - offset_w + imgArray[i].left + "px";
        theImg.style.top = field_height / 2 - offset_h + imgArray[i].top + "px";
      }
    }
  })();

  var picMove = function (pageX, pageY) {
    for (i in imgArray) {
      var theImg = document.getElementsByClassName("img_" + i)[0];
      var offset_w = rate_w * pageX * imgArray[i].scale;
      var offset_h = rate_h * pageY * imgArray[i].scale;
      if (imgArray[i].isFont == true) {
        theImg.style.left = field_width / 2 + offset_w + imgArray[i].left + "px";
        theImg.style.top = field_height / 2 + offset_h + imgArray[i].top + "px";
      } else {
        theImg.style.left = field_width / 2 - offset_w + imgArray[i].left + "px";
        theImg.style.top = field_height / 2 - offset_h + imgArray[i].top + "px";
      }
    }
  }

  document.body.onmousemove = function (e) {
    picMove(e.pageX, e.pageY);
  };
}